// components/emotion-card/index.js
// 情感卡片组件逻辑

const { TimeUtils, ColorUtils } = require('../../utils/index')

/**
 * 情感卡片组件
 */
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    // 情感数据
    emotion: {
      type: Object,
      value: {},
      observer: 'onEmotionChange'
    },
    
    // 胶囊数据
    capsule: {
      type: Object,
      value: {},
      observer: 'onCapsuleChange'
    },
    
    // 是否显示操作按钮
    showActions: {
      type: Boolean,
      value: false
    },
    
    // 是否选中
    selected: {
      type: Boolean,
      value: false
    },
    
    // 是否加载中
    loading: {
      type: Boolean,
      value: false
    },
    
    // 自定义样式类名
    className: {
      type: String,
      value: ''
    },
    
    // 自定义样式
    customStyle: {
      type: String,
      value: ''
    },
    
    // 主题
    theme: {
      type: String,
      value: 'default' // default, light, dark
    },
    
    // 尺寸
    size: {
      type: String,
      value: 'medium' // small, medium, large
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    // 背景粒子
    particles: [],
    
    // 渐变颜色
    gradientColor: '',
    
    // 图标背景色
    iconBg: '',
    
    // 图标颜色
    iconColor: '',
    
    // 发光颜色
    glowColor: '',
    
    // 强度颜色
    intensityColor: '',
    
    // 标签颜色
    tagColors: [
      'rgba(255, 107, 107, 0.8)',
      'rgba(255, 159, 67, 0.8)',
      'rgba(255, 206, 84, 0.8)',
      'rgba(72, 219, 251, 0.8)',
      'rgba(111, 207, 151, 0.8)',
      'rgba(162, 155, 254, 0.8)'
    ]
  },

  /**
   * 组件的方法列表
   */
  methods: {
    /**
     * 监听情感数据变化
     */
    onEmotionChange(newEmotion) {
      if (newEmotion && Object.keys(newEmotion).length > 0) {
        this.updateColors(newEmotion)
        this.generateParticles()
      }
    },
    
    /**
     * 监听胶囊数据变化
     */
    onCapsuleChange(newCapsule) {
      if (newCapsule && Object.keys(newCapsule).length > 0) {
        // 将胶囊数据转换为情感数据格式
        const emotionData = {
          id: newCapsule.id,
          type: newCapsule.mood || 'neutral',
          intensity: newCapsule.intensity || 5,
          title: newCapsule.title,
          content: newCapsule.description || newCapsule.content,
          timestamp: newCapsule.createTime || newCapsule.timestamp,
          tags: newCapsule.tags || [],
          status: newCapsule.status
        }
        this.updateColors(emotionData)
        this.generateParticles()
      }
    },
    
    /**
     * 生成背景粒子
     */
    generateParticles() {
      const particles = []
      const count = 8 + Math.floor(Math.random() * 5) // 8-12个粒子
      
      for (let i = 0; i < count; i++) {
        particles.push({
          x: Math.random() * 100,
          y: Math.random() * 100,
          delay: Math.random() * 3
        })
      }
      
      this.setData({ particles })
    },
    
    /**
     * 更新颜色主题
     */
    updateColors(emotion) {
      const emotionType = emotion.emotion || 'neutral'
      const intensity = emotion.intensity || 50
      
      // 根据情感类型设置颜色
      const colorMap = {
        happy: {
          gradient: 'linear-gradient(135deg, #FFD93D 0%, #FF6B6B 100%)',
          icon: '#FFD93D',
          glow: '#FFD93D',
          intensity: '#FFD93D'
        },
        sad: {
          gradient: 'linear-gradient(135deg, #74b9ff 0%, #0984e3 100%)',
          icon: '#74b9ff',
          glow: '#74b9ff',
          intensity: '#74b9ff'
        },
        angry: {
          gradient: 'linear-gradient(135deg, #ff7675 0%, #d63031 100%)',
          icon: '#ff7675',
          glow: '#ff7675',
          intensity: '#ff7675'
        },
        excited: {
          gradient: 'linear-gradient(135deg, #fd79a8 0%, #e84393 100%)',
          icon: '#fd79a8',
          glow: '#fd79a8',
          intensity: '#fd79a8'
        },
        calm: {
          gradient: 'linear-gradient(135deg, #81ecec 0%, #00b894 100%)',
          icon: '#81ecec',
          glow: '#81ecec',
          intensity: '#81ecec'
        },
        anxious: {
          gradient: 'linear-gradient(135deg, #fdcb6e 0%, #e17055 100%)',
          icon: '#fdcb6e',
          glow: '#fdcb6e',
          intensity: '#fdcb6e'
        },
        love: {
          gradient: 'linear-gradient(135deg, #fd79a8 0%, #fdcb6e 100%)',
          icon: '#fd79a8',
          glow: '#fd79a8',
          intensity: '#fd79a8'
        },
        neutral: {
          gradient: 'linear-gradient(135deg, #b2bec3 0%, #636e72 100%)',
          icon: '#b2bec3',
          glow: '#b2bec3',
          intensity: '#b2bec3'
        }
      }
      
      const colors = colorMap[emotionType] || colorMap.neutral
      
      // 根据强度调整透明度
      const alpha = Math.max(0.6, intensity / 100)
      
      this.setData({
        gradientColor: colors.gradient,
        iconBg: `rgba(255, 255, 255, ${0.2 + alpha * 0.1})`,
        iconColor: colors.icon,
        glowColor: colors.glow,
        intensityColor: colors.intensity
      })
    },
    
    /**
     * 格式化时间
     */
    formatTime(timestamp) {
      if (!timestamp) return ''
      return TimeUtils.getRelativeTime(timestamp)
    },
    
    /**
     * 卡片点击事件
     */
    onCardTap(e) {
      const { emotion, capsule } = e.currentTarget.dataset
      
      // 触发自定义事件
      this.triggerEvent('tap', {
        emotion: emotion || this.data.emotion,
        capsule: capsule || this.data.capsule
      })
      
      // 添加点击动画
      this.addTapAnimation()
    },
    
    /**
     * 编辑按钮点击
     */
    onEdit(e) {
      const { emotion } = e.currentTarget.dataset
      
      this.triggerEvent('edit', {
        emotion: emotion || this.data.emotion
      })
    },
    
    /**
     * 分享按钮点击
     */
    onShare(e) {
      const { emotion } = e.currentTarget.dataset
      
      this.triggerEvent('share', {
        emotion: emotion || this.data.emotion
      })
    },
    
    /**
     * 删除按钮点击
     */
    onDelete(e) {
      const { emotion } = e.currentTarget.dataset
      
      // 显示确认对话框
      wx.showModal({
        title: '确认删除',
        content: '确定要删除这条情感记录吗？',
        confirmText: '删除',
        confirmColor: '#ff4757',
        success: (res) => {
          if (res.confirm) {
            this.triggerEvent('delete', {
              emotion: emotion || this.data.emotion
            })
          }
        }
      })
    },
    
    /**
     * 添加点击动画
     */
    addTapAnimation() {
      const animation = wx.createAnimation({
        duration: 200,
        timingFunction: 'ease-out'
      })
      
      // 缩放动画
      animation.scale(0.95).step()
      animation.scale(1).step()
      
      this.setData({
        animationData: animation.export()
      })
    },
    
    /**
     * 更新情感数据
     */
    updateEmotion(emotion) {
      this.setData({ emotion })
      this.onEmotionChange(emotion)
    },
    
    /**
     * 设置选中状态
     */
    setSelected(selected) {
      this.setData({ selected })
    },
    
    /**
     * 设置加载状态
     */
    setLoading(loading) {
      this.setData({ loading })
    },
    
    /**
     * 获取情感数据
     */
    getEmotion() {
      return this.data.emotion
    },
    
    /**
     * 刷新组件
     */
    refresh() {
      this.generateParticles()
      this.updateColors(this.data.emotion)
    }
  },

  /**
   * 组件生命周期
   */
  lifetimes: {
    /**
     * 组件实例刚刚被创建
     */
    created() {
      // 组件实例刚刚被创建好时，不能调用 setData
    },
    
    /**
     * 组件实例进入页面节点树
     */
    attached() {
      // 初始化组件
      this.generateParticles()
      if (this.data.emotion && Object.keys(this.data.emotion).length > 0) {
        this.updateColors(this.data.emotion)
      }
    },
    
    /**
     * 组件在视图层布局完成后执行
     */
    ready() {
      // 组件布局完成
    },
    
    /**
     * 组件实例被移动到节点树另一个位置
     */
    moved() {
      // 组件实例被移动到节点树另一个位置
    },
    
    /**
     * 组件实例被从页面节点树移除
     */
    detached() {
      // 清理资源
    }
  },

  /**
   * 组件所在页面的生命周期
   */
  pageLifetimes: {
    /**
     * 组件所在的页面被展示
     */
    show() {
      // 页面被展示
    },
    
    /**
     * 组件所在的页面被隐藏
     */
    hide() {
      // 页面被隐藏
    },
    
    /**
     * 组件所在的页面尺寸变化
     */
    resize(size) {
      // 页面尺寸变化
    }
  }
})